<template>
	<view class="page" >
        <block v-if="info">
            <!-- 咨询师详情 -->
            <view class="container bac-color-fff" >
                <image class="consultor-banner mar-t-8 box-b" :src="info.user.avatar" mode="widthFix"></image>
                <view class="info  pad-b-20">
                    <view class="flex">
                        <view class="flex-1">
                            <view class="flex align-center justify-between mar-t-12">
                                <view class="">
                                	<text class="font-size-18 font-bold">{{info.user.nickname||''}}</text>
                                	<text class="font-size-10 font-color-666 mar-l-5">从业{{info.work_time||1}}年</text>
                                </view>
								<view class="flex align-center text-center mar-l-10 font-color-price font-size-12 font-bold">
								   <text>助人指数</text>
								   <text class="mar-l-3">{{info.help_num||1}}</text>
								</view>
                            </view>
                            <view class="tag mar-t-10 flex align-center flex-wrap" v-if="info.tag_text">
                                <block v-for="(tag,k) in info.tag_text" :key="k">
                                    <text class="tag-item mar-r-5 mar-b-5 font-size-12" v-if="k<3">{{tag||''}}</text>
                                </block>
                            </view>
                            <!-- <view class="desc font-color-666 mar-t-5">
                                <text class="font-size-12">{{info.user.bio||''}}</text>
                            </view> -->
                        
                        </view>
                        
                    </view>
                     <view class="desc  mar-t-5 flex align-center ">
                        <image src="@/static/icons/address.png" style="height:1em;width:1em"></image>
                        <text class="font-size-13 font-color-666 dis-block mar-l-8">{{info.room.name||''}}</text>
                    </view>
                </view>
                
            </view>

            <!-- 咨询师内容部分 -->
            <block v-if="content">
                <clear-line :height="13" :bacColor="'#F4F5FA'"></clear-line>
                <view class="container bac-color-fff pad-t-20 pad-b-60" >
                      <rich-text :nodes="content"></rich-text>
                </view>
            </block>
            <!-- 咨询师内容部分结束 -->

             <!-- 用户评价 -->
            <block v-if="evaluate_list">
               <view class="container pad-t-20 pad-b-80 bac-color-fff mar-t-13">
                    <navigator hover-class="none" :url="'/pages/evaluate/list?id='+id+'&type='+type" class="flex align-center">
                        <view>
                            <image  src="@/static/icons/consult/pinglun.png" class="icon mar-t-5"></image>
                        </view>
                        <view class="flex-1 mar-l-10">
                            <text class="font-size-20 font-bold font-color-333">用户评价记录</text>
                        </view>
                        <view>
                            <!-- <icon :type="'download'" size="26" /> -->
                            <mk-icon :src="''"  class="icon"></mk-icon>
                        </view>
                    </navigator>
                     <evaluate-list class="bac-color-fff mar-t-13" :range="evaluate_list"></evaluate-list>
               </view>
               
            </block>
             <!-- 用户评价结束 -->

            <!-- 底部按钮 -->
            <!-- <view class="pos-fixed flex footer bac-color-fff text-center">
                <navigator
                    url="/pages/index/index"
                    open-type="switchTab"
                    hover-class="none"    
                    class="flex-1" 
                >
                    <image class="mar-t-5" src="@/static/icons/consult/home.png"></image>
                    <view><text class="font-size-12 font-color-888">首页</text></view>
                </navigator>
                <navigator
                    url="/pages/kefu/kefu"
                    open-type="navigate"
                    hover-class="none" 
                    class="flex-1" >
                    <image class="mar-t-5" src="@/static/icons/kefu.png"></image>
                    <view><text class="font-size-12 font-color-888">客服</text></view>
                </navigator>
                <view class="flex-1" @click="follow">
                    <image class="mar-t-5" v-if="followed == true" src="@/static/icons/consult/follow-active.png"></image>
                    <image class="mar-t-5"  v-else src="@/static/icons/consult/follow.png"></image>
                    <view><text class="font-size-12 font-color-888">收藏</text></view>
                </view>
                <view class="flex-3 yuyue-btn flex  align-center justify-center" @click="yuye">
                    <text class="font-color-fff font-size-15 font-bold" >立即预约</text>
                </view>
            </view> -->
            <!-- 底部按钮结束 -->
        </block>
	</view>
</template>

<script>
import {getConsultorDetail,followExits,followAdd,followCancel,evaluatesList} from '@/utils/http'
import evaluateList from '@/components/evaluate-list'
export default {
    data(){
        return {
            info:'',
            followed:false,
            id:'',
            content:'',
            evaluate_list:'',
            type:'consult_order',
            
        }
    },
    components:{
        evaluateList
    },
    methods:{
        yuye(){
            uni.navigateTo({
                url: '/pages/order/create?id=' + this.id
            });
        },
        detail(id){
            getConsultorDetail({id}).then(res=>{
                if(res){
                    this.info = res   
                    this.content = this.formatRichText(res.content)
                 // this.content = res.content.replace(/\\/g, "").replace(/<img/g, "<img style=\"display:none;\"").replace(/<o:p>/g, "").replace(/<\/o:p>/g, "");
                         
                }
            })
        },
        
        async followExits(){
            await followExits({type:'counselor',ids:this.id}).then(res=>{
                this.followed = res ?  true :false;
            })
        },
        follow(){
            if(this.followed == true){
                //取消关注
                followCancel({type:'counselor',id:this.id}).then(res=>{
                    this.followed = false;
                })
            }else{
                //关注
                followAdd({type:'counselor',id:this.id}).then(res=>{
                    this.followed = res && res.follow_count > 0 ?  true :false;
                    // this.follow_id = res.id;
                })
            }
           
        },
        getEvaluateList(){
            evaluatesList({type:this.type,related_id:this.id,type:'consult_order'}).then(res=>{
                if(res){
                    this.evaluate_list = res.data
                }
            })
        }
        //获取评价数据
    },
    onLoad(option){
        this.id = option.id;
        this.followExits();
        this.detail(option.id);
        this.getEvaluateList();
    }
}
</script>

<style scoped>
page{
    background-color: rgb(244, 245, 250);
}
.consultor-banner {
    width: 100%;
	height: 180em;
	background-color: #cccccc;
	border-radius: 10px;
}

.tag .tag-item {
	padding: 3px 8px;
	border-radius: 2px;
	color: #0088ff;
	background-color: rgba(216, 229, 240, 0.932);
}

.pad-b-80{
    padding-bottom: 4.45em;
}
.footer{
    width: 100%;
    bottom: 0;
    min-height: 2.8em;
    box-shadow: 3px -2px 16px 6px rgb(243, 240, 240);
}
.footer image{
    height: 1.11em;
    width: 1.11em;
}
.yuyue-btn{
    background-color: #0088FF;
}
</style>